<template>
    <div class="page">
        <div v-for="(item,index) in questionArray" class="singleView" >
            <div class="questionTitleView">{{item.questionnaireTitle}}</div>
            <div class="questionDescView">{{item.questionnaireDesc}}</div>
            <div class="questionFootView">
                 <div class="btnView" @click="clickShowHint">查看更多</div>
                 <div class="btnView">填写问卷</div>
            </div>
        </div>
    </div>
</template>

<script>
import vueJsxPlugin from '@vitejs/plugin-vue-jsx';
import axios from 'axios';
let that = null;
export default {
    data() {
        return {
            questionArray:[]
        }
    },

    mounted() {
        console.log("-----------------------mounted")
        that = this;
        that.queryQuestion();
    },

    methods: {
        queryQuestion() {
            
            axios({
                method: "post",
                url:"/api/community/hcbQuestionnaire/getMoreQuestionnaireList",
                data: { "channelId": 16, "phoneNumber": "17635663998" },
                headers:{
                    jwt:"eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIxNDE1MjciLCJleHAiOjE3MTc1NzY1NDcsImlhdCI6MTcxNjk3MTc0NywiQWNjb3VudEluZm8iOnsiaWQiOjE0MTUyNywibW9iaWxlIjoiMTc2MzU2NjM5OTgiLCJ1c2VyVHlwZSI6MSwiaW1QYXNzd29yZCI6InYxczAxdjIxTmciLCJpc1NldExvZ2luUGFzc3dvcmQiOnRydWUsIm9zTmFtZSI6IkFuZHJvaWQiLCJsYXN0TG9naW5UaW1lIjoiMjAyNC0wNS0yOSAxNjozNTo0NyIsInZlcnNpb24iOiIxIiwidXNlclJvbGUiOlsiUk9MRV9QQVRJRU5UIl0sImlzRW5hYmxlIjpmYWxzZSwiYWRkVGltZSI6IjIwMjQtMDQtMjQgMTY6MTg6MjEifX0.KfLYytPMTsGRWCBiuQjt0W1qU3HOujYBR1b6vM1r5yk"
                }
            }).then(function (res) {
                console.log(res);
                console.log(res.data)
                if(res.data.status==0){
                    that.questionArray=res.data.retValue;
                }
            }).catch(function (error) {
                console.log(error)
            })
        },
        clickShowHint(){
            
        }
    }
}




</script>

<style>

    .page{
        height: 100%;
        display: flex;
        flex-direction: column;
        align-content: center;
        
    }

    .singleView{
        padding:20px;
        background: #EBF1ff;
        border-radius: 10px;
        margin-top: 16px;
        width: 94%;
        margin-left: auto;
        margin-right: auto;
    }

    .questionTitleView{
      font-size: 20px;
      font-weight: bold;
    }

    .questionDescView{
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        word-break: break-all;
        overflow: hidden;
        margin-top: 10px;
    }

    .questionFootView{
        display: flex;
        justify-content: space-between;
        align-content: center;
        margin-top: 10px;
    }

    .btnView{
        height: 30px;
        width: 100px;
        border-radius: 15px;
        background-color: beige;
        display: flex;
        align-items: center;
        justify-content: center;
    }
</style>